import { useSearchParams, useLocation } from "react-router-dom";

export default function Search() {
  // key=value -> name: jack age: 18
  const [search] = useSearchParams();
  console.log("search", search.get("name"));
  console.log("search", search.get("age"));

  const location = useLocation();
  console.log("location", location);
  /*
    ?name=jack&age=18 -> { name: 'jack', age: 18 }
    location.search.slice(1) -> name=jack&age=18
    location.search.slice(1).split('&') -> ['name=jack', 'age=18']
  */
  const data = location.search
    .slice(1)
    .split("&")
    .reduce((p, c) => {
      const [key, value] = c.split("=");
      p[key] = value;
      return p;
    }, {});
  console.log("data", data);

  return <div>Search</div>;
}
